﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="YS.WebTrade.Index.aspx.cs" Inherits="WebTrade.Index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>LayOut</title>
    <link href="Scripts/jquery-easyui-1.3.6/themes/default/easyui.css" rel="stylesheet"
        type="text/css" />
    <link href="Scripts/jquery-easyui-1.3.6/themes/icon.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery-easyui-1.3.6/jquery.easyui.min.js" type="text/javascript"></script>
    <style type="text/css">
        .footer
        {
            width: 100%;
            text-align: center;
            line-height: 35px;
        }
        
        .header
        {
            background-color: #d8e4fe;
            height: 80px;
        }
        
        .sysMenu
        {
            margin-left: -30px;
        }
        .sysMenu div
        {
            padding-left: 30px;
        }
        .sysMenu div ul
        {
            overflow: hidden;
            display: none;
            height: auto;
        }
        .sysMenu span
        {
            display: block;
            height: 25px;
            line-height: 25px;
            padding-left: 5px;
            margin: 1px 0;
            cursor: pointer;
            border-bottom: 1px solid #CCC;
        }
        .sysMenu span:hover
        {
            background-color: #e6e6e6;
            color: #cf0404;
        }
        .sysMenu a
        {
            color: #333;
            text-decoration: none;
        }
        .sysMenu a:hover
        {
            color: #06F;
        }
        .btn
        {
            height: 30px;
            margin-top: 10px;
            border-bottom: 1px solid #CCC;
        }
    </style>
</head>
<body class="easyui-layout">
    <div region="north" border="true" split="true" style="overflow: hidden; height: 80px;">
        <div class="header">
        </div>
    </div>
    <div region="south" border="true" split="true" style="overflow: hidden; height: 40px;">
        <div class="footer">
            版权所有： iSun Software Studio</a></div>
    </div>
    <div region="west" split="true" title="导航菜单" style="width: 200px;">
        <div id="nav">
        </div>
    </div>
    <div id="mainPanle" region="center" style="overflow: hidden;">
    </div>
</body>
</html>

<script type="text/javascript">
    var menuJson = <%=menu %>

//        $(document).ready(function () {
//        
//        alert(menuJson.toString());

//        });


        /*递归实现获取无级树数据并生成DOM结构*/
    var str = "";
    var forTree = function (o) {
        for (var i = 0; i < o.length; i++) {
        debugger;
            var urlstr = "";
            try {
                if (typeof o[i]["URL"] == "undefined") {
                    urlstr = "<div><span>" + o[i]["Name"] + "</span><ul>";
                } else {
                    urlstr = "<div><span><a href=" + o[i]["URL"] + ">" + o[i]["Name"] + "</a></span><ul>";
                }
                str += urlstr;
                if (o[i]["Children"] != null) {
                    forTree(o[i]["Children"]);
                }
                str += "</ul></div>";
            } catch (e) { }
        }
        return str;
    }
    /*添加无级树*/
    document.getElementById("sysMenu").innerHTML = forTree(menuJson);
    /*树形菜单*/
    var sysMenu = function () {
        //给有子对象的元素加[+-]
        $("#sysMenu ul").each(function (index, element) {
            var ulContent = $(element).html();
            var spanContent = $(element).siblings("span").html();
            if (ulContent) {
                $(element).siblings("span").html("[+] " + spanContent)
            }
        });

        $("#sysMenu").find("div span").click(function () {
            var ul = $(this).siblings("ul");
            var spanStr = $(this).html();
            var spanContent = spanStr.substr(3, spanStr.length);
            if (ul.find("div").html() != null) {
                if (ul.css("display") == "none") {
                    ul.show(300);
                    $(this).html("[-] " + spanContent);
                } else {
                    ul.hide(300);
                    $(this).html("[+] " + spanContent);
                }
            }
        })
    } ()

    
    function curzt(v) {
        $("#sysMenu span").each(function (index, element) {
            var ul = $(this).siblings("ul");
            var spanStr = $(this).html();
            var spanContent = spanStr.substr(3, spanStr.length);
            if (ul.find("div").html() != null) {
                $(this).html("[" + v + "] " + spanContent);
            }
        });
    }

    //初始化左侧
function InitLeftMenu() {
	$("#nav").accordion({animate:false,fit:true,border:false});
	var selectedPanelname = '';

    $.each(_menus.menus, function(i, n) {
		var menulist ='';
		menulist +='<ul class="navlist">';

        $.each(n.menus, function(j, o) {
			menulist += '<li><div ><a ref="'+o.menuid+'" href="#" rel="' + o.url + '" ><span class="icon '+o.icon+'" >&nbsp;</span><span class="nav">' + o.menuname + '</span></a></div> ';

			if(o.child && o.child.length>0)
			{
				//li.find('div').addClass('icon-arrow');

				menulist += '<ul class="third_ul">';
				$.each(o.child,function(k,p){
					menulist += '<li><div><a ref="'+p.menuid+'" href="#" rel="' + p.url + '" ><span class="icon '+p.icon+'" >&nbsp;</span><span class="nav">' + p.menuname + '</span></a></div> </li>'
				});
				menulist += '</ul>';
			}

			menulist+='</li>';
        })

		menulist += '</ul>';

		$('#nav').accordion('add', {
            title: n.menuname,
            content: menulist,
				border:false,
            iconCls: 'icon ' + n.icon
        });

		if(i==0)
			selectedPanelname =n.menuname;

    });
	$('#nav').accordion('select',selectedPanelname);



	$('.navlist li a').click(function(){
		var tabTitle = $(this).children('.nav').text();

		var url = $(this).attr("rel");
		var menuid = $(this).attr("ref");
		var icon = $(this).find('.icon').attr('class');

		var third = find(menuid);
		if(third && third.child && third.child.length>0)
		{
			$('.third_ul').slideUp();

			var ul =$(this).parent().next();
			if(ul.is(":hidden"))
				ul.slideDown();
			else
				ul.slideUp();



		}
		else{
			addTab(tabTitle,url,icon);
			$('.navlist li div').removeClass("selected");
			$(this).parent().addClass("selected");
		}
	}).hover(function(){
		$(this).parent().addClass("hover");
	},function(){
		$(this).parent().removeClass("hover");
	});





	//选中第一个
	//var panels = $('#nav').accordion('panels');
	//var t = panels[0].panel('options').title;
    //$('#nav').accordion('select', t);
}
</script>
